<template>
  <view class="content">
    <view class="apply-card">
      <view class="card-left">
        <view
          style="
            width: 90%;
            display: flex;
            align-items: center;
            margin-top: 30rpx;
          "
          ><text style="font-size: 16px; font-weight: 600; margin-right: 40rpx"
            >个人报名</text
          >
          <view
            style="
              width: 188rpx;
              height: 50rpx;
              display: flex;
              align-items: center;
              justify-content: center;
              background-color: #136bff30;
              border-radius: 5rpx;
              font-weight: 600;
            "
            @click="xuzhi(1)"
          >
            <text style="font-size: 13px; color: #136bffff; font-weight: 600"
              >参加报名须知</text
            >
          </view>
        </view>
        <view
          style="
            width: 90%;
            margin-top: 30rpx;
            font-size: 13px;
            color: #797979ff;
          "
          ><text>我以个人身份报名，参加竞价，并以个人身份进行签约</text></view
        >
        <view style="width: 90%">
          <view
            style="
              width: 220rpx;
              height: 70rpx;
              background-color: #0c6bff;
              color: white;
              display: flex;
              align-items: center;
              margin-top: 40rpx;
              justify-content: center;
              border-radius: 10rpx;
            "
            @click="goSignUp(1)"
            >立即报名</view
          >
        </view>
      </view>
      <view class="card-right">
        <image
          src="@/static/image/electBidding/geren.png"
          style="width: 212rpx; height: 212rpx; margin-top: 80rpx"
        />
      </view>
    </view>
    <view class="apply-card">
      <view class="card-left">
        <view
          style="
            width: 90%;
            display: flex;
            align-items: center;
            margin-top: 30rpx;
          "
          ><text style="font-size: 16px; font-weight: 600; margin-right: 40rpx"
            >合作社报名</text
          >
          <view
            style="
              width: 188rpx;
              height: 50rpx;
              display: flex;
              align-items: center;
              justify-content: center;
              background-color: #136bff30;
              border-radius: 5rpx;
              font-weight: 600;
            "
            @click="xuzhi(2)"
          >
            <text style="font-size: 13px; color: #136bffff; font-weight: 600"
              >参加报名须知</text
            >
          </view>
        </view>
        <view
          style="
            width: 90%;
            margin-top: 30rpx;
            font-size: 13px;
            color: #797979ff;
          "
          ><text
            >我是合作社成员我以合作社身份去参加竞价并以合作社身份签约</text
          ></view
        >
        <view style="width: 90%">
          <view
            style="
              width: 220rpx;
              height: 70rpx;
              background-color: #0c6bff;
              color: white;
              display: flex;
              align-items: center;
              margin-top: 40rpx;
              justify-content: center;
              border-radius: 10rpx;
            "
            @click="goSignUp(2)"
            >立即报名</view
          >
        </view>
      </view>
      <view class="card-right">
        <image
          src="@/static/image/electBidding/hezuoshe.png"
          style="width: 212rpx; height: 212rpx; margin-top: 80rpx"
        />
      </view>
    </view>

    <view class="apply-card">
      <view class="card-left">
        <view
          style="
            width: 90%;
            display: flex;
            align-items: center;
            margin-top: 30rpx;
          "
          ><text style="font-size: 16px; font-weight: 600; margin-right: 40rpx"
            >家庭农场报名</text
          >
          <view
            style="
              width: 188rpx;
              height: 50rpx;
              display: flex;
              align-items: center;
              justify-content: center;
              background-color: #136bff30;
              border-radius: 5rpx;
              font-weight: 600;
            "
            @click="xuzhi(3)"
          >
            <text style="font-size: 13px; color: #136bffff; font-weight: 600"
              >参加报名须知</text
            >
          </view>
        </view>
        <view
          style="
            width: 90%;
            margin-top: 30rpx;
            font-size: 13px;
            color: #797979ff;
          "
          ><text
            >我是家庭农场我以家庭农场身份区域参加竞价并以家庭农场身份签约</text
          ></view
        >
        <view style="width: 90%">
          <view
            style="
              width: 220rpx;
              height: 70rpx;
              background-color: #0c6bff;
              color: white;
              display: flex;
              align-items: center;
              margin-top: 40rpx;
              justify-content: center;
              border-radius: 10rpx;
            "
            @click="goSignUp(3)"
            >立即报名</view
          >
        </view>
      </view>
      <view class="card-right">
        <image
          src="@/static/image/electBidding/jiating.png"
          style="width: 212rpx; height: 212rpx; margin-top: 80rpx"
        />
      </view>
    </view>

    <view class="apply-card">
      <view class="card-left">
        <view
          style="
            width: 90%;
            display: flex;
            align-items: center;
            margin-top: 30rpx;
          "
          ><text style="font-size: 16px; font-weight: 600; margin-right: 40rpx"
            >法人单位签约</text
          >
          <view
            style="
              width: 188rpx;
              height: 50rpx;
              display: flex;
              align-items: center;
              justify-content: center;
              background-color: #136bff30;
              border-radius: 5rpx;
              font-weight: 600;
            "
            @click="xuzhi(4)"
          >
            <text style="font-size: 13px; color: #136bffff; font-weight: 600"
              >参加报名须知</text
            >
          </view>
        </view>
        <view
          style="
            width: 90%;
            margin-top: 30rpx;
            font-size: 13px;
            color: #797979ff;
          "
          ><text
            >我是以公司成员我以公司身份去参加竞价并以公司身份签约</text
          ></view
        >
        <view style="width: 90%">
          <view
            style="
              width: 220rpx;
              height: 70rpx;
              background-color: #0c6bff;
              color: white;
              display: flex;
              align-items: center;
              margin-top: 40rpx;
              justify-content: center;
              border-radius: 10rpx;
            "
            @click="goSignUp(4)"
            >立即报名</view
          >
        </view>
      </view>
      <view class="card-right">
        <image
          src="@/static/image/electBidding/faren.png"
          style="width: 212rpx; height: 212rpx; margin-top: 80rpx"
        />
      </view>
    </view>

    <uni-popup ref="showTips" type="dialog">
      <uni-popup-dialog
        ref="inputClose"
        type="info"
        :justShowOk="true"
        :title="title"
        @confirm="dialogInputConfirm"
      >
        <view
          style="display: flex; flex-direction: column; align-items: center"
        >
          <view
            style="color: #797979ff; font-size: 13px"
            v-for="(item, index) in contents"
            :key="index"
            >{{ item }}</view
          >
        </view>
      </uni-popup-dialog>
    </uni-popup>
  </view>
</template>

<script>
export default {
  data() {
    return {
      title: "个人报名须知",
      contents: [
        "身份证原件",
        "经办人授权委托书原件",
        "经办人身份证原件",
        "打款证明(备注项目编号) 原件",
      ],
      data: "",
    };
  },
  onLoad(e) {
    console.log(e);
    this.data = e.data;
  },
  methods: {
    goSignUp(e) {
      uni.navigateTo({
        url: "/pages/electBidding/signUp?data=" + e + "&val=" + this.data,
      });
    },
    xuzhi(e) {
      switch (e) {
        case 1:
          this.title = "个人报名须知";
          this.contents = [
            "身份证原件",
            "经办人授权委托书原件",
            "经办人身份证原件",
            "打款证明(备注项目编号) 原件",
          ];
          break;
        case 2:
          this.title = "合作社报名须知";
          this.contents = [
            "营业执照副本原件",
            "机构代码证原件",
            "法定代表人身份证明原件（盖章）",
            "法定代表人身份证原件",
            "经办人授权委托书原件（盖章）",
            "经办人身份证原件",
            "合作社章程原件",
            "合作社成员大会决议原件",
            "打款证明（备注项目编号）原件",
          ];
          break;
        case 3:
          this.title = "家庭农场报名须知";
          this.contents = [
            "营业执照副本原件",
            "机构代码证原件",
            "负责人身份证明原件（盖章）",
            "负责人身份证原件",
            "经办人授权委托书原件（盖章）",
            "经办人身份证原件",
            "打款证明（备注项目编号）原件",
          ];
          break;
        case 4:
          this.title = "法人单位签约须知";
          this.contents = [
            "营业执照副本原件",
            "机构代码证原件",
            "法定代表人身份证明原件（盖章）",
            "负责人身份证原件",
            "经办人授权委托书原件（盖章）",
            "经办人身份证原件",
            "公司章程原件",
            "股东会决议",
            "董事会决议原件",
            "打款证明（备注项目编号）原件",
          ];
          break;
        default:
          break;
      }
      this.$refs.showTips.open();
    },
  },
};
</script>

<style scoped lang="less">
.content {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  .apply-card {
    width: 94%;
    height: 316rpx;
    margin-top: 20rpx;
    box-shadow: #d4d4d452 0px 0px 10px 5px;
    border-radius: 10rpx;
    display: flex;
    justify-content: space-around;
    align-items: center;
    .card-left {
      flex: 5;
      display: flex;
      flex-direction: column;
      align-items: center;
      height: 100%;
    }
    .card-right {
      flex: 2;
    }
  }
}
</style>
